<template>
  <BasicModal v-bind="$attrs" destroyOnClose title="用户详情" :helpMessage="['用户信息']" :width="modalWidth" :footer="null" @register="registerModal">
    <Description class="mt-4" title="会员详情" :column="{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }" :data="userInfo.data" :schema="userInfoSchema" />
  </BasicModal>
</template>
<script lang="ts" setup>
import { ref, unref, reactive } from 'vue';
import { BasicModal, useModalInner } from '@apps/antd-admin/src/components/modal';
import { DescItem, Description } from '@apps/antd-admin/src/components/description';
import { getUserInfo } from '../data/api';
import { useAppInject } from '@apps/antd-admin/src/hooks/web/use-app-inject';

const { getIsMobile } = useAppInject();
const modalWidth = ref('50%');
if (unref(getIsMobile)) {
  modalWidth.value = '80%';
}
let userInfo: Recordable = reactive({ data: {} });
const userInfoSchema: DescItem[] = [
  {
    field: 'userName',
    label: '用户姓名',
    span: 3,
  },
  {
    field: 'mainAccount',
    label: '用户账号',
    span: 3,
  },
  {
    field: 'status',
    label: '会员状态',
    span: 3,
    render: (curVal, data) => {
      let statusArray = [
        { label: '禁用', value: 0 },
        { label: '启用', value: 1 },
      ];
      const status: any = statusArray.find((item) => item.value == curVal);
      if (status) {
        return status.label;
      }
      return '';
    },
  },
  {
    field: 'isOld',
    label: '会员类型',
    span: 3,
    render: (curVal, data) => {
      let isOldArray = [
        { label: '有卡会员', value: true },
        { label: '无卡会员', value: false },
      ];
      const isOld: any = isOldArray.find((item) => item.value == curVal);
      if (isOld) {
        return isOld.label;
      }
      return '';
    },
  },
  {
    field: 'mobile',
    label: '手机号',
    span: 3,
  },
  {
    field: 'telephone',
    label: '应急电话',
    span: 3,
  },
  {
    field: 'identityTypeDesc',
    label: '证件类型',
    span: 3,
  },
  {
    field: 'identityNo',
    label: '证件号码',
    span: 3,
  },
  {
    field: 'registerWayLabel',
    label: '注册方式',
    span: 3,
  },
  {
    field: 'airportName',
    label: '注册地',
    span: 3,
  },
  {
    field: 'createTime',
    label: '注册时间',
    span: 3,
  },
  {
    field: 'weChatName',
    label: '所属公众号',
    span: 3,
  },
  {
    field: 'remark',
    label: '备注',
    span: 10,
  },
];

//详情赋值
const [registerModal] = useModalInner(async (data) => {
  let record = data.record;
  let userId = record.userId;
  getUserInfo({ userId: userId, handlerName: 'appUserInfoHandler' }).then((result) => {
    console.info(result);
    userInfo.data = result;
  });
});
</script>
